<template>
	<neil-modal :show="isShow" @close="onClose" title="提示" confirm-text="关闭" :show-cancel="false">
		<view class="text-center">
			<text>请授权个人信息</text>
		</view>
		<view class="login">
			<button type="primary" @click="getuserinfo">授权</button>
			<!-- <button type="primary" open-type="getUserInfo" @getuserinfo="getuserinfo">授权</button> -->
			<!-- <button type="primary" open-type="getUserInfo" @getuserinfo="getuserinfo">授权</button> -->
		</view>
	</neil-modal>
</template>

<script>
	import neilModal from '@/components/neil-modal.vue'
	export default {
		name: 'user-login',
		components: {
			neilModal
		},
		props: {
			show: {
				type: Boolean,
				default: false
			}
		},
		data: function() {
			return {
				isShow: false
			}
		},
		created() {
			this.isShow = this.show
		},
		watch: {
			show(val) {
				this.isShow = val
			}

		},
		methods: {
			getuserinfo: function(e) {
				let self = this
				uni.getUserProfile({
					desc: '请允许我们获取您的个人基础信息',
					lang: 'zh_CN',
					async success(e) {
						
						let userinfo = e.userInfo
						let $info = self.$store.state.userinfo
						
						let user = { ...$info,
							...{
								nickName: userinfo.nickName,
								faceUrl: userinfo.avatarUrl,
								city: userinfo.city,
								country: userinfo.country,
								gender: userinfo.gender,
								language: userinfo.language,
								province: userinfo.province
							}
						}
						var {
							data
						} = await self.$http.post('/mobile/grant', user)
						self.$store.commit('setUserInfo', data)
						self.$store.commit('setIsLogin', true)
						uni.showToast({
							title: '登录成功'
						})

						self.onClose()
					}
					
				})
				
			},
			onClose: function() {
				this.isShow = false
				this.$emit('close')
			}
		}
	}
</script>

<style>
	.text-center {
		padding: 20upx;
		text-align: center;
	}

	.login {
		padding: 20upx 50upx;
	}
</style>
